<template>
    <el-dialog @open="open" v-model="isOpen" :title="'未接收的'+props.detailInfo.wareId+'号仓库采购单'" @close="close" style="width: 450px;">
        <el-select v-model="purchaseId" placeholder="选择采购单" style="width: 240px">
            <el-option
                    v-for="purchase in purchases"
                    :key="purchase.id"
                    :value="purchase.id"
            >
                <span style="float: left">{{ purchase.wareId }}号仓库</span>
                <span style="float: right;color: var(--el-text-color-secondary);font-size: 13px;">
        {{ purchase.id }}号采购单
      </span>
            </el-option>
        </el-select>
        <el-button type="primary" style="margin-left: 15px" activity @click="mergeWmsPurchaseDetail">确定</el-button>
        <el-button @click="close" type="success" activity >取消</el-button>
    </el-dialog>
</template>

<script setup>
    import {ref,reactive} from 'vue'
    import request from '@/utils/request.js'
    import { ElMessage } from 'element-plus'
    const  emits = defineEmits(['close','reload'])

    let dataForm = ref(null)
    let props = defineProps(['detailInfo'])
    let form = reactive({})
    let purchases = ref([])
    let purchaseId = ref([])
    let isOpen = ref(false)
    defineExpose({isOpen})

    function open(){
        request.get(`/api/wmsPurchase/getUnreceicedWmsPurchasePage/${props.detailInfo.wareId}`).then(resp => {
            purchases.value = resp.records
        })
    }

    function close(){
        isOpen.value = false
        emits("close")
    }

    function mergeWmsPurchaseDetail(){
        let param = {
            purchaseId:purchaseId.value,
            items: props.detailInfo.detailIds,
            wareId: props.detailInfo.wareId
        }
        request.post("/api/wmsPurchase/merge", param).then(resp => {
            emits("close")
            emits("reload")
            if(resp){
                ElMessage({message: '合并成功！',type: 'success'})
            }else{
                ElMessage({message: '合并失败！',type: 'error'})
            }
        })
    }
</script>

<style scoped>

</style>